var userzd = [
    {id: 1,shouFeiXM:"维修服务费", danJia:"￥20.00",guiGe:"/人/次",tongZhiFS:"APP 短信",zhuangTai:"禁用"},
    {id: 2,shouFeiXM:"商电预缴", danJia:"￥2000.00",guiGe:"/6个月",tongZhiFS:"APP 短信",zhuangTai:"启用"},
    {id: 3,shouFeiXM:"电费", danJia:"￥0.58",guiGe:"/度(Kwh)",tongZhiFS:"APP 短信",zhuangTai:"启用"},
    {id: 4,shouFeiXM:"水费", danJia:"￥3.00",guiGe:"/顿",tongZhiFS:"APP 短信",zhuangTai:"启用"},
    {id: 5,shouFeiXM:"燃气费", danJia:"￥2.10",guiGe:"/立方米",tongZhiFS:"APP 短信",zhuangTai:"启用"},
    {id: 6,shouFeiXM:"卫生费", danJia:"￥3",guiGe:"/人/月",tongZhiFS:"APP 短信",zhuangTai:"启用"},
    {id: 7,shouFeiXM:"车位管理费", danJia:"￥1800.00",guiGe:"/车位/6个月",tongZhiFS:"APP 短信",zhuangTai:"启用"},
    {id: 8,shouFeiXM:"物业费", danJia:"￥4.00",guiGe:"/平方米/月",tongZhiFS:"APP 短信",zhuangTai:"启用"},
    {id: 9,shouFeiXM:"高温费", danJia:"￥5.00",guiGe:"/人/月",tongZhiFS:"APP 短信",zhuangTai:"启用"},
    {id: 10,shouFeiXM:"整理费", danJia:"￥12.00",guiGe:"/人/月",tongZhiFS:"APP 短信",zhuangTai:"禁用"},
    {id: 11,shouFeiXM:"通行费", danJia:"￥8.00",guiGe:"/人/次",tongZhiFS:"APP 短信",zhuangTai:"启用"}
]


var operid = -1;
var perSize = 10;
var currentPage = 1; 
var totalPage = -1; 
var totalTiao = 11;
var perSizeArr = [10,5,15];

// window.onload=function(){
    displayUserTable();
    pagebar();
    pageClick();
    add();
    del();
    find();
    select();
    edit();
    currentDisplay();
// }

function displayUserTable(){
    $("#userTable").html("");
    // $("#checkAll")[0].checked=false;
    var start = (currentPage -1 )*perSize;
    var end = start + perSize;
    var outHtml = "";
    for(var i=start;i<end&&i<userzd.length;i++){
        outHtml+="<tr>"+
        // "<td><input type='checkbox' name=\"checkItem\" /></td>"+
        "<td>"+userzd[i].id+"</td>"+
        "<td>"+userzd[i].shouFeiXM+"</td>"+
        "<td>"+userzd[i].danJia+"</td>"+
        "<td>"+userzd[i].guiGe+"</td>"+
        "<td>"+userzd[i].tongZhiFS+"</td>"+
        "<td>"+userzd[i].zhuangTai+"</td>"+
        "<td><button class=\"btn btn-default del\" data-index='"+i+"'>删除</button><button class=\"btn btn-default edit\"  data-index='"+i+"'>编辑</button></td>"+
        "</tr>";
    }
    $("#userTable").html(outHtml);
    pagebar();
    pageClick();
}


function add(){
    
    $("#btnAddForm").click(function(){
        operid= -1;
        $("#addUser").modal('show');
    })
    $("#btnAdd").click(function(){
        var id = $("#txtId").val();
        var shouFeiXM = $("#txtshouFeiXM").val();
        var danJia = $("#txtdanJia").val();
        var guiGe = $("#txtguiGe").val();
        var tongZhiFS = $("#txttongZhiFS").val();
        var zhuangTai = $("#txtzhuangTai").val();
         
        var obj = {"id":id,"shouFeiXM":shouFeiXM,"danJia":danJia,"guiGe":guiGe,"tongZhiFS":tongZhiFS,"zhuangTai":zhuangTai};

        if(operid==-1){
            userzd.push(obj);
        }else{
            userzd.splice(operid,1,obj);
        }
        id = $("#txtId").val("");
        shouFeiXM = $("#txtshouFeiXM").val("");
        danJia = $("#txtdanJia").val("");
        guiGe = $("#txtguiGe").val("");
        tongZhiFS = $("#txttongZhiFS").val("");
        zhuangTai = $("#txtzhuangTai").val("");
        displayUserTable();
        $("#addUser").modal('hide');
        currentDisplay();
        $("#moren").prop({"selected":"selected"});
    })
    $("#btnCancel").click(function(){
        $("#addUser").modal('hide');

    })
}

function edit(){
    $("#userTable").on('click','.edit',function(){
        var index = $(this).attr('data-index');
        operid = index;
        $("#addUser").modal('show');
        $("#txtId").val(userzd[index].id);
        $("#txtshouFeiXM").val(userzd[index].shouFeiXM);
        $("#txtdanJia").val(userzd[index].danJia);
        $("#txtguiGe").val(userzd[index].guiGe);
        $("#txttongZhiFS").val(userzd[index].tongZhiFS);
        $("#txtzhuangTai").val(userzd[index].zhuangTai);
    })
}

function del(){
    $("#userTable").on('click','.del',function(){
        var index = $(this).attr('data-index');
        userzd.splice(index,1);
        displayUserTable();
        currentDisplay();
        $("#moren").prop({"selected":"selected"});
    })
}

function find(){
    $("#exampleInputName2").on("keyup",function(){
        var j = 0;
        var shuru = $(this).val();
        var result = new RegExp(shuru);
        var outHtml = "";
        if(shuru!=""){
            for(var i=0;i<user.length;i++){
                var match = userzd[i].shouFeiXM;
                if(result.test(match)){
                    outHtml+="<tr>"+
                    "<td>"+userzd[i].id+"</td>"+
                    "<td>"+userzd[i].shouFeiXM+"</td>"+
                    "<td>"+userzd[i].danJia+"</td>"+
                    "<td>"+userzd[i].guiGe+"</td>"+
                    "<td>"+userzd[i].tongZhiFS+"</td>"+
                    "<td>"+userzd[i].zhuangTai+"</td>"+
                    "<td><button class=\"btn btn-default del\" data-index='"+i+"'>删除</button><button class=\"btn btn-default edit\"  data-index='"+i+"'>编辑</button></td>"+
                    "</tr>"
                    j++;
                }
                $("#userTable").html(outHtml);

                // 当前显示的条数
                var myperSize = document.getElementById("perSize");
                // 总条数
                var mytotalTiao = document.getElementById("totalTiao");
                // 当前页面
                var mycurrentPage = document.getElementById("currentPage");
                // 总页面
                var mytotalPage = document.getElementById("totalPage");

                if(j<=perSizeArr[0]){
                    myperSize.innerText = j;
                    mytotalTiao.innerText = j;
                    mycurrentPage.innerText = 1;
                    mytotalPage.innerText = 1;

                }else{
                    myperSize.innerText =10;
                    mytotalTiao.innerText = j;
                    mycurrentPage.innerText = 1
                    mytotalPage.innerText = Math.ceil(j / perSizeArr[0]);
                }
                totalPage = Math.ceil(j / perSize);
                var str = "";
                for(var k = 0;k<totalPage;k++){
                    if(currentPage==(k+1)){
                        str+="<button class=\"btn btn-primary page\">"+(k+1)+"</button>";
                    }else{
                        str+="<button class=\"btn btn-default page\">"+(k+1)+"</button>";
                    }
                }
                $("#divPage").html(str);
            }
        }else{
            displayUserTable();
            currentDisplay();
        }    
    })
}

function select(){
    $("#selectOption").change(function(e){
        var j = 0;
        var xuanXiang = $(this).val();
        var outHtml = "";
        var result = new RegExp(xuanXiang);
        for(var i=0;i<userzd.length;i++){
            var match = userzd[i].zhuangTai;
            if(result.test(match)){
                outHtml+="<tr>"+
                // "<td><input type='checkbox' name=\"checkItem\" /></td>"+
                "<td>"+userzd[i].id+"</td>"+
                "<td>"+userzd[i].shouFeiXM+"</td>"+
                "<td>"+userzd[i].danJia+"</td>"+
                "<td>"+userzd[i].guiGe+"</td>"+
                "<td>"+userzd[i].tongZhiFS+"</td>"+
                "<td>"+userzd[i].zhuangTai+"</td>"+
                "<td><button class=\"btn btn-default del\" data-index='"+i+"'>删除</button><button class=\"btn btn-default edit\"  data-index='"+i+"'>编辑</button></td>"+
                "</tr>"
                $("#userTable").html(outHtml);
                j++;
                // 当前显示的条数
                var myperSize = document.getElementById("perSize");
                // 总条数
                var mytotalTiao = document.getElementById("totalTiao");
                // 当前页面
                mycurrentPage = document.getElementById("currentPage");
                // 总页面
                var mytotalPage = document.getElementById("totalPage");

                if(j<=perSizeArr[0]){
                    myperSize.innerText = j;
                    mytotalTiao.innerText = j;
                    mycurrentPage.innerText = 1;
                    mytotalPage.innerText = 1;

                }else{
                    myperSize.innerText =10;
                    mytotalTiao.innerText = j;
                    mycurrentPage.innerText = 1
                    mytotalPage.innerText = Math.ceil(j / perSizeArr[0]);
                }
                
                totalPage = Math.ceil(j / perSize);
                if(currentPage>totalPage){
                    currentPage = totalPage;
                }
                var str = "";
                for(var k = 0;k<totalPage;k++){
                    if(currentPage==(k+1)){
                        str+="<button class=\"btn btn-primary page\">"+(k+1)+"</button>";
                    }else{
                        str+="<button class=\"btn btn-default page\">"+(k+1)+"</button>";
                    }
                }
                $("#divPage").html(str);
                 
                }else if(xuanXiang  == "全部"){
                    displayUserTable();
                    currentDisplay();
                }
                
        }
    })
}


function checkAll(){
    $("#checkAll").click(function(){
        var checked = this.checked;
        $("input[name='checkItem']").each(function(index,item){
            item.checked =checked;
        })
    })
}

function checkItemAll(){
    $("#userTable").on('click','input[name=\'checkItem\']',function(){
        var isAll = true;
        $("input[name='checkItem']").each(function(index,item){
            if(!item.checked){
                isAll = false;
            }
        })
        if(isAll){
            $("#checkAll")[0].checked=true;
        }else{
            $("#checkAll")[0].checked=false;
        }
    })
}

// 当页面只显示10条内容时
function currentDisplay(){
    // 当前显示的条数
    var myperSize = document.getElementById("perSize");
    // 总条数
    var mytotalTiao = document.getElementById("totalTiao");
    // 当前页面
    var mycurrentPage = document.getElementById("currentPage");
    // 总页面
    var mytotalPage = document.getElementById("totalPage");

    if(userzd.length<=perSizeArr[0]){
        myperSize.innerText = userzd.length;
        mytotalTiao.innerText = userzd.length;
        mycurrentPage.innerText = 1;
        mytotalPage.innerText = 1;
   
    }else{
        myperSize.innerText =10;
        mytotalTiao.innerText = userzd.length;
        mycurrentPage.innerText = 1;
        mytotalPage.innerText = Math.ceil(userzd.length / perSizeArr[0]);
    }
}

function pagebar(){
    totalPage = Math.ceil(userzd.length / perSize);
    if(currentPage>totalPage){
        currentPage = totalPage;
    }
    $("#divPage").html("");
    var str = "";
    for(var i = 0;i<totalPage;i++){
        if(currentPage==(i+1)){
            str+="<button class=\"btn btn-primary page\">"+(i+1)+"</button>";
        }else{
            str+="<button class=\"btn btn-default page\">"+(i+1)+"</button>";
        }
    }
    $("#divPage").html(str);
}

function pageClick(){
    $("#divPage").on("click",".page",function(){
        $(".page").each(function(index,item){
            $(this).removeClass('btn-primary');
        });
        $(this).addClass('btn-primary');
        currentPage = Number(this.innerText);
        var mycurrentPage = document.getElementById("currentPage");
        var myperSize = document.getElementById("perSize");
        mycurrentPage.innerText = currentPage;
        myperSize.innerText = userzd.length - 10;
        displayUserTable();
    });

}